<template>
	<!-- <el-tabs v-model="current" tab-position="left">
		<el-tab-pane name="0" label=""></el-tab-pane>
	</el-tabs> -->
	<el-form label-width="120px">
		<el-tag
			:type="item.type"
			closable
			@close="onclose(index)"
			style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; margin-left: 25px; margin-right: 25px;"
			v-for="(item, index) in tag"
			:key="index"
		>
			{{ item.text }}
		</el-tag>
		<el-form-item prop="ossPlatFormDto.compressFlag" style="margin-top: 30px;">
			<template #label>
				关键字提取
				<el-tooltip placement="top">
					<div slot="content">
            仅支持UTF-8格式，不超过10000字符，超过部分再次将分次请求接口
					</div>
					<i class="el-icon-info"></i>
				</el-tooltip>
			</template>
			<el-select v-model="formData.keywordsextaction">
				<el-option label="不启用" value=""></el-option>
				<el-option
					:label="item.name"
					:value="item.code"
					v-for="(item, index) in keywordsextaction.paramMap.options"
					:key="index"
				></el-option>
			</el-select>
      <span>
        <span> 个数：</span>
        <el-input-number :step="1" step-strictly :min="0" style="width: 200px" v-model="keywordCount" autocomplete="off" placeholder="请输入个数"></el-input-number>
      </span>


		</el-form-item>
		<el-form-item prop="ossPlatFormDto.compressFlag">
			<template #label>
				摘要提取
				<el-tooltip placement="top">
					<div slot="content">
            仅支持UTF-8格式，腾讯云不超过2000字，阿里云不超过800字。超过部分再次将分次请求接口
					</div>
					<i class="el-icon-info"></i>
				</el-tooltip>
			</template>
			<el-select v-model="formData.autosummariization">
				<el-option label="不启用" value=""></el-option>
				<el-option
					:label="item.name"
					:value="item.code"
					v-for="(item, index) in autosummariization.paramMap.options"
					:key="index"
				></el-option>
			</el-select>

      <span>
        <span> 字数：</span>
        <el-input-number :step="1" step-strictly :min="0" style="width: 200px" v-model="abstractWordCount" autocomplete="off" placeholder="请输入字数"></el-input-number>
      </span>
		</el-form-item>
		<el-form-item prop="ossPlatFormDto.compressFlag">
			<template #label>
				文本纠错
				<el-tooltip placement="top">
					<div slot="content">
            仅支持UTF-8格式，不超过128字符
					</div>
					<i class="el-icon-info"></i>
				</el-tooltip>
			</template>
			<el-select v-model="formData.textcorrection">
				<el-option label="不启用" value=""></el-option>
				<el-option
					:label="item.name"
					:value="item.code"
					v-for="(item, index) in textcorrection.paramMap.options"
					:key="index"
				></el-option>
			</el-select>
		</el-form-item>
		<el-form-item prop="ossPlatFormDto.compressFlag">
			<template #label>
				文本审核
				<el-tooltip placement="top">
					<div slot="content">
            最长10000个中文字符（包含标点）
					</div>
					<i class="el-icon-info"></i>
				</el-tooltip>
			</template>
			<el-select v-model="formData.textaudit" style="margin-bottom: 20px;">
				<el-option label="不启用" value=""></el-option>
				<el-option
					:label="item.name"
					:value="item.code"
					v-for="(item, index) in textaudit.paramMap.options"
					:key="index"
				></el-option>
			</el-select>
			<br />
			<el-checkbox-group v-model="detectType" size="mini" v-if="formData.textaudit">
				<el-checkbox border label="Porn">涉黄</el-checkbox>
				<el-checkbox border label="Terrorism">涉暴恐</el-checkbox>
				<el-checkbox border label="Politics">政治敏感</el-checkbox>
				<el-checkbox border label="Ads">广告</el-checkbox>
				<el-checkbox border label="Illegal">违法</el-checkbox>
				<el-checkbox border label="Abuse">谩骂</el-checkbox>
			</el-checkbox-group>
		</el-form-item>
		<el-form-item>
			<el-button type="primary" @click="onSubmit">保存</el-button>
		</el-form-item>
	</el-form>
</template>

<script>
import request from "@/common/request"

export default {
	data() {
		return {
      keywordCount: 0,
      abstractWordCount: 0,
			current: "0",
			formData: {
				keywordsextaction: "",
				autosummariization: "",
				textcorrection: "",
				textaudit: "",
			},
			keywordsextaction: {
				id: "",
				bindCode: "",
				groupCode: "",
				bindDetail: "",
				paramMap: {
					options: [],
					platform: "",
          keywordsCount: 0,
				},
			},
			autosummariization: {
				id: "",
				bindCode: "",
				groupCode: "",
				bindDetail: "",
				paramMap: {
					options: [],
					platform: "",
          abstractWordCount: 0,
				},
			},
			textcorrection: {
				id: "",
				bindCode: "",
				groupCode: "",
				bindDetail: "",
				paramMap: {
					options: [],
					platform: "",
				},
			},
			textaudit: {
				id: "",
				bindCode: "",
				groupCode: "",
				bindDetail: "",
				paramMap: {
					options: [],
					platform: "",
					detectType: "",
				},
			},
			detectType: [],

			tag: [
				{
					type: "primary",
					text: "这里的配置在CMS中已经集成，其他模块需要自己进行集成。集成可以参考官方文档。",
				},
				{
					type: "danger",
					text: "下方没有的选项为暂未集成的，关键字提取&文本审核未集成阿里云",
				},
			],
		}
	},
	created() {
		this.getData()
	},
	methods: {
		onclose(index) {
			this.tag.splice(index, 1)
		},
		async getData() {
			const { data } = await request("get", "/system/configApi/list")
			const API_KEYWORDSEXTACTION = data.find(item => item.bindCode === "API_KEYWORDSEXTRACTION") // 关键字提取
			const API_AUTOSUMMARIIZATION = data.find(item => item.bindCode === "API_AUTOSUMMARIIZATION") // 摘要提取
			const API_TEXTCORRECTION = data.find(item => item.bindCode === "API_TEXTCORRECTION") // 文本纠错
			const API_TEXTAUDIT = data.find(item => item.bindCode === "API_TEXTAUDIT") // 文本审核

			if (API_KEYWORDSEXTACTION) {
				this.keywordsextaction = API_KEYWORDSEXTACTION
				this.formData.keywordsextaction = API_KEYWORDSEXTACTION.paramMap.platform
				this.keywordCount = API_KEYWORDSEXTACTION.paramMap.keywordCount
			}
			if (API_AUTOSUMMARIIZATION) {
				this.autosummariization = API_AUTOSUMMARIIZATION
				this.formData.autosummariization = API_AUTOSUMMARIIZATION.paramMap.platform
        this.abstractWordCount = API_AUTOSUMMARIIZATION.paramMap.abstractWordCount
      }
			if (API_TEXTCORRECTION) {
				this.textcorrection = API_TEXTCORRECTION
				this.formData.textcorrection = API_TEXTCORRECTION.paramMap.platform
			}
			if (API_TEXTAUDIT) {
				this.textaudit = API_TEXTAUDIT
				this.formData.textaudit = API_TEXTAUDIT.paramMap.platform
				this.detectType = API_TEXTAUDIT.paramMap.detectType.split(",").filter(item => item)
			}
		},
		async onSubmit() {
			if (this.detectType.length <= 0) {
				if (this.formData.textaudit) {
					return this.$message.error("请选择检测类型")
				}
			}

			if (Array.isArray(this.detectType)) {
				this.textaudit.paramMap.detectType = this.detectType.join(",")
			}

			this.keywordsextaction.paramMap.platform = this.formData.keywordsextaction
			this.autosummariization.paramMap.platform = this.formData.autosummariization
			this.textcorrection.paramMap.platform = this.formData.textcorrection
			this.textaudit.paramMap.platform = this.formData.textaudit

      this.keywordsextaction.paramMap.keywordCount = this.keywordCount
			this.keywordsextaction.bindDetail = JSON.stringify(this.keywordsextaction.paramMap)

			this.autosummariization.paramMap.abstractWordCount = this.abstractWordCount
			this.autosummariization.bindDetail = JSON.stringify(this.autosummariization.paramMap)
			this.textcorrection.bindDetail = JSON.stringify(this.textcorrection.paramMap)
			this.textaudit.bindDetail = JSON.stringify(this.textaudit.paramMap)

			const formData = [this.keywordsextaction, this.autosummariization, this.textcorrection, this.textaudit]

			const { code, msg } = await request("post", "/system/configApi/editBatch", formData)
			if (code == 0) {
				this.$message.success("保存成功")
			} else {
				this.$message.error(msg)
			}
		},
	},
}
</script>

<style lang="scss" scoped></style>
<style lang="scss">
.el-form-item__label {
	position: relative;
	z-index: 2;
}
</style>
